<div class="padding-bottom-45">
  <div class="modal-header">
    <div class="modal-title">{{ title }}</div>
  </div>

  <div nz-row class="mb-md">
    <div nz-col [nzSpan]="24">
      <nz-input-group nzSearch [nzAddOnAfter]="suffixButton">
        <input nz-input name="value" [(ngModel)]="queryFindRoles.filter" nzSize="default" [placeholder]="'搜索 . . .'" />
      </nz-input-group>
      <ng-template #suffixButton>
        <button nz-button nzType="primary" (click)="getFindRoles()" [nzLoading]="tableLoading" nzSearch>
          查询
        </button>
      </ng-template>
    </div>
  </div>
  <ng-template #totalContentMe>共{{ queryFindRoles.total }}条</ng-template>
  <nz-table #nzTable [nzData]="queryFindRoles.list" [nzFrontPagination]="false" [nzTotal]="queryFindRoles.total"
    [(nzPageIndex)]="queryFindRoles.pageIndex" [(nzPageSize)]="queryFindRoles.pageSize" [nzLoading]="tableLoading"
    [nzShowSizeChanger]="true" (nzPageIndexChange)="getFindRoles()" (nzPageSizeChange)="getFindRoles()" nzSize="middle"
    [nzShowTotal]="totalContentMe">
    <thead nz-thead>
      <tr>
        <th>
          <label nz-checkbox [(ngModel)]="isSelectedAll" (ngModelChange)="checkAll($event)">
          </label>
        </th>
        <th nz-th>
          <span>名字</span>
        </th>
      </tr>
    </thead>
    <tbody nz-tbody>
      <tr nz-tbody-tr *ngFor="let item of queryFindRoles.list; let irow = index"
        [style.background]="irow % 2 == 0 ? 'whitesmoke' : ''">
        <td nz-td>
          <label nz-checkbox [(ngModel)]="item.roleSelected" (ngModelChange)="isCancelCheck($event)">
          </label>
        </td>
        <td nz-td>{{ item.name }}</td>
      </tr>
    </tbody>
  </nz-table>
  <div class="modal-footer">
    <button nz-button type="button" [disabled]="saving" (click)="close()">取消</button>
    <button nz-button [nzType]="'primary'" type="submit" [disabled]="saving" (click)="save()">保存</button>
  </div>
</div>